<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" style="height: 100%;padding: 0;margin: 0;"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head>
    <title>公共配置</title>
    <meta charset="UTF-8"/>
    <link rel="stylesheet" type="text/css" th:href="@{/easyui/themes/default/easyui.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/easyui/themes/icon.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/easyui/demo/demo.css}"/>
    <script type="text/javascript" th:src="@{/easyui/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/easyui/jquery.easyui.min.js}"></script>
    <script type="text/javascript" th:src="@{/easyui/locale/easyui-lang-zh_CN.js}"></script>
</head>
<body style="height: 100%;width: 100%;padding: 0;margin: 0;">
<table id="tt" title="公共配置列表" style="width:100%;height:100%;"
       data-options="toolbar:toolbar,rownumbers:true,singleSelect:true,pagination:true,url:'/t/common/config/list',method:'post'">
    <thead>
    <tr>
        <th field="id" checkbox="true"></th>
        <th field="type" width="12%">配置类型</th>
        <th field="typeRemark" width="14%">类型说明</th>
        <th field="keys" width="12%">配置键</th>
        <th field="keysRemark" width="14%">配置键说明</th>
        <th field="value" width="17%">配置值</th>
        <th field="valuesRemark" width="22%">配置值说明</th>
        <th field="state" width="5%" formatter="formatEnable">是否有效</th>
    </tr>
    </thead>
</table>


<script type="text/javascript">
    function formatEnable(value) {
        if (value == 1) {
            return '有效';
        } else {
            return '无效';
        }
    }

    $(function () {
        var pager = $('#tt').datagrid().datagrid('getPager');
    })
    var toolbar = [];
</script>

<script sec:authorize="hasRole('T_COMMON_CONFIG_ADD')">
    toolbar.push('-', {
        text: '新增',
        iconCls: 'icon-add',
        handler: function () {
            $("#typeId").textbox("setValue", '');
            $("#typeRemarkId").textbox("setValue", '');
            $("#keysId").textbox("setValue", '');
            $("#keysRemarkId").textbox("setValue", '');
            $("#valueId").textbox("setValue", '');
            $("#valueRemarkId").textbox("setValue", '');
            $('#addDialog').dialog('open');
        }
    });
</script>

<script sec:authorize="hasRole('T_COMMON_CONFIG_UPDATE_STATE')">
    toolbar.push('-', {
        text: '有效无效',
        iconCls: 'icon-save',
        handler: function () {
            var row = $('#tt').treegrid('getSelected');
            if (row) {
                var msg='确定这条记录要设置为无效吗?';
                var state=0;
                if (row.state==0){
                    msg='确定这条记录要设置为有效吗?';
                    state=1;
                }
                $.messager.confirm('提示', msg, function (res) {
                    if (res) {
                        $.post("/t/common/config/updateState", {id: row.id,state:state}, function (result) {
                            if (result == '1') {
                                console.log("success");
                                reloads();
                            } else {
                                $.messager.alert("提示", "操作失败");
                            }
                        });
                    }
                });
            } else {
                $.messager.alert("提示", "请先选中一条记录");
            }

        }
    });
</script>

<script sec:authorize="hasRole('T_COMMON_CONFIG_UPDATE')">
    toolbar.push('-', {
        text: '修改',
        iconCls: 'icon-save',
        handler: function () {
            var row = $('#tt').treegrid('getSelected');
            if (row) {
                var updateId = row.id;
                $("#hiddenUpdateId").val(updateId);
                $("#updateTypeId").textbox("setValue", row.type);
                $("#updateTypeRemarkId").textbox("setValue", row.typeRemark);
                $("#updateKeysId").textbox("setValue", row.keys);
                $("#updateKeysRemarkId").textbox("setValue", row.keysRemark);
                $("#updateValueId").textbox("setValue", row.value);
                $("#updateValueRemarkId").textbox("setValue", row.valuesRemark);
                $('#updateDialog').dialog('open');
            } else {
                $.messager.alert("提示", "请先选择需要修改的数据");
            }
        }
    });
</script>

<script sec:authorize="hasRole('T_COMMON_CONFIG_DELETE')">
    toolbar.push('-', {
        text: '删除',
        iconCls: 'icon-remove',
        handler: function () {
            var row = $('#tt').treegrid('getSelected');
            if (row) {
                $.messager.confirm('提示', '确定要删除这条记录吗?', function (res) {
                    if (res) {
                        $.post("/t/common/config/deleteById", {id: row.id}, function (result) {
                            if (result == '1') {
                                console.log("success");
                                reloads();
                            } else if (result == '2') {
                                $.messager.alert("提示", "请先删除角色下所有的用户！");
                            } else {
                                $.messager.alert("提示", "删除错误");
                            }
                        });
                    }
                });
            } else {
                $.messager.alert("提示", "请先选中一条记录");
            }

        }
    });
</script>

<script type="text/javascript">
    toolbar.push('-', {
        text: '刷新',
        iconCls: 'icon-reload',
        handler: reloads
    });

    function reloads() {
        $('#tt').datagrid('reload');//刷新
    }
</script>


<div id="addDialog" class="easyui-dialog" title="新增数据" maximizable="true" resizable="true"
     style="width:80%;height:450px;width:800px;padding:10px"
     data-options="title:'新增数据',modal:true,closed:true">
    <div style="margin-bottom:20px">
        <input id="typeId" class="easyui-textbox" name="type" style="width:100%"
               data-options="label:'参数类型:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="typeRemarkId" class="easyui-textbox" name="typeRemark" style="width:100%"
               data-options="label:'参数类型说明:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="keysId" class="easyui-textbox" name="keys" style="width:100%"
               data-options="label:'参数键:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="keysRemarkId" class="easyui-textbox" name="keysRemark" style="width:100%"
               data-options="label:'参数键说明:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="valueId" class="easyui-textbox" name="value" style="width:100%"
               data-options="label:'参数值:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="valueRemarkId" class="easyui-textbox" name="valueRemark" style="width:100%"
               data-options="label:'参数值说明:',required:true">
    </div>
    <div style="text-align:center;padding:5px 0">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()" style="width:80px">保存</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="cancelForm('addDialog')"
           style="width:80px">取消</a>
    </div>
</div>
<script>
    function cancelForm(id) {
        $('#' + id).dialog('close');
    }

    function submitForm() {
        var type = $("#typeId").val();
        var typeRemark = $("#typeRemarkId").val();
        var keys = $("#keysId").val();
        var keysRemark = $("#keysRemarkId").val();
        var value = $("#valueId").val();
        var valueRemark = $("#valueRemarkId").val();
        $.post("/t/common/config/insert", {
            type: type,
            typeRemark: typeRemark,
            keys: keys,
            keysRemark: keysRemark,
            value: value,
            valueRemark: valueRemark
        }, function (result) {
            $('#addDialog').dialog('close');
            if (result == '1') {
                console.log("success");
                reloads();
            } else {
                $.messager.alert("提示", "操作失败");
            }
        });
    }
</script>


<div id="updateDialog" class="easyui-dialog" title="编辑数据" maximizable="true" resizable="true"
     style="width:80%;height:450px;width:800px;padding:10px" data-options="title:'编辑数据',modal:true,closed:true">
    <input type="hidden" id="hiddenUpdateId"/>
    <div style="margin-bottom:20px">
        <input id="updateTypeId" class="easyui-textbox" name="type" style="width:100%"
               data-options="label:'参数类型:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="updateTypeRemarkId" class="easyui-textbox" name="typeRemark" style="width:100%"
               data-options="label:'参数类型说明:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="updateKeysId" class="easyui-textbox" name="keys" style="width:100%"
               data-options="label:'参数键:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="updateKeysRemarkId" class="easyui-textbox" name="keysRemark" style="width:100%"
               data-options="label:'参数键说明:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="updateValueId" class="easyui-textbox" name="value" style="width:100%"
               data-options="label:'参数值:',required:true">
    </div>
    <div style="margin-bottom:20px">
        <input id="updateValueRemarkId" class="easyui-textbox" name="valueRemark" style="width:100%"
               data-options="label:'参数值说明:',required:true">
    </div>
    <div style="text-align:center;padding:5px 0">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitUpdateForm()" style="width:80px">保存</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="cancelForm('updateDialog')" style="width:80px">取消</a>
    </div>
</div>
<script>
    function submitUpdateForm() {
        var updateId = $("#hiddenUpdateId").val();
        var type = $("#updateTypeId").val();
        var typeRemark=$("#updateTypeRemarkId").val();
        var keys = $("#updateKeysId").val();
        var keysRemark=$("#updateKeysRemarkId").val();
        var value = $("#updateValueId").val();
        var valuesRemark = $("#updateValueRemarkId").val();
        $.post("/t/common/config/update", {id: updateId, type: type, typeRemark: typeRemark, keys: keys, keysRemark: keysRemark, value: value, valuesRemark: valuesRemark}, function (result) {
            $('#updateDialog').dialog('close');
            if (result == '1') {
                console.log("success");
                reloads();
            } else {
                $.messager.alert("提示", "操作失败");
            }
        });
    }
</script>


<div id="menuUpdateDialog" class="easyui-dialog" title="分配权限" maximizable="true" resizable="true"
     style="width:50%;height:450px;width:800px;padding:10px"
     data-options="title:'分配权限',modal:true,closed:true">
    <input type="hidden" id="hiddenMenuUpdateId"/>
    <div style="margin-bottom:20px">
        <ul id="menuTree" class="easyui-tree" data-options="animate:true,checkbox:true"></ul>
    </div>
    <div style="text-align:center;padding:5px 0">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitMenuUpdateForm()"
           style="width:80px">保存</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="cancelForm('menuUpdateDialog')"
           style="width:80px">取消</a>
    </div>
</div>

<script>
    function submitMenuUpdateForm() {
        var s = getChecked();
        if (s === '') {
            $.messager.alert("提示", "至少选择一个菜单");
        } else {
            var roleId = $("#hiddenMenuUpdateId").val();
            $.post("/sys/role/updateRoleMenu", {roleId: roleId, menuIds: s}, function (result) {
                if (result == '1') {
                    console.log("success");
                    cancelForm('menuUpdateDialog');
                    reloads();
                } else {
                    $.messager.alert("提示", "操作错误");
                }
            });
        }
    }

    function getChecked() {
        var nodes = $('#menuTree').tree('getChecked', ['checked', 'indeterminate']);
        var s = '';
        for (var i = 0; i < nodes.length; i++) {
            if (s != '') s += ',';
            s += nodes[i].id;
        }
        return s;
    }
</script>
</body>
</html>